<template>
    <div class="container">
        <div></div>
        <div>
            <el-form :model="form" label-width="auto">
                <el-form-item prop="ApprovalOpinions" label="审批备注">
                    <el-input v-model="form.ApprovalOpinions" type="textarea"></el-input>
                </el-form-item>
                <el-form-item prop="form.ApprovalStatus" label="审批结果">
                    <el-radio-group v-model="form.ApprovalStatus">
                        <el-radio :value="3">通过</el-radio>
                        <el-radio :value="4">驳回</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item>
                    <el-button @click="submit" type="primary">确认</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import delayInfoApi from '../../api/delayInfoApi';
import { ElMessage } from 'element-plus';

const {id} = defineProps({
    id:{
        type:Number,
        required:true
    }
});

const emit = defineEmits(["onSave"]);


interface Form{
    ApprovalOpinions:string
    ApprovalStatus:number
}

const form = ref<Form>({
    ApprovalOpinions:"",
    ApprovalStatus:3
})

const submit = ()=>{
    delayInfoApi.approval({...form.value,delayId:id}).then((res:any)=>{
        if(res.code==1){
            ElMessage.success({
                message:"审批成功",
            });
        }else{
            ElMessage.error({
                message:"审批失败"
            });
        }
        emit("onSave")
    });
    
}
</script>

<style scoped>
.container{
    display:grid;
    grid-template-columns: 1fr 1fr;
}
</style>